<template>
	<view class="work-container">
		<view class="" v-for="(item,index) in box">
			<view class="header">{{item.header}}</view>
			<view class="box" v-for="k in item.son" @click="leaveFor(k.URL)">
				<view class="box-left">
					<view class="">
						<image :src="k.img" mode="" style="width: 48rpx;height: 48rpx;"></image>
					</view>
					<view class="text">
						<view class="text-one">
							{{k.text}}
						</view>
						<view class="text-two">
							{{k.text1}}
						</view>
					</view>
				</view>
				<view class="">
					<u-icon name="arrow-right" color="#bcbdc5"></u-icon>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				box: [{
					// URL是跳转去相应页面的路径
					// 后面拼接的state是点击去相应页面的展示的状态
					id: 10,
					header: '设备信息',
					son: [{
						img: '/static/images/index/shebeitaizhang.png',
						text: '设备台账',
						text1: '设备的详细信息、维保等',
						URL:`/pages/facilityInformation/book/index`,
						
					}],
					// , {
					// 	img: '/static/images/index/chuzhiqingdan.png',
					// 	text: '处置清单',
					// 	text1: '设备的去向，如报废、转让、等',
					// 	URL:`/pages/inventory/index/index`
					// }
				}, {
					id: 9,
					header: '设备信息',
					son: [{
						img: '/static/images/index/baoxiudan.png',
						text: '报修单',
						text1: '每台设备的报修次数、原因等',
						URL:`/pages/facilityMaintain/index/index?state=${'RECEIVING'}`,
						
					},{
						img: '/static/images/index/dxjrw.png',
						text: '点巡检任务',
						text1: '每台设备的详细信息、维保等',
						URL:`/pages/facilityPatrol/index/index?status=${0}`
					}, {
						img: '/static/images/index/baoyangrenwu.png',
						text: '保养任务',
						text1: '每台设备的详细信息、维保等',
						URL:`/pages/facilityUpkeep/idnex/idnex?status=${0}`
					}]
				}]
			}
		},

		created() {

		},
		onLoad() {

		},
		methods: {
				leaveFor(URL){
					uni.navigateTo({
						url:URL
					})
				}
		}
	}
</script>

<style lang="scss">
	.header {
		opacity: 1;
		/** 文本1 */
		font-size: 32rpx;
		line-height: 1;
		font-weight: 700;
		color: rgba(32, 37, 64, 1);
		text-align: left;
		margin-top: 48rpx;
	}

	.box {
		height: 112rpx;
		opacity: 1;
		border-radius: 12rpx;
		background: rgba(255, 255, 255, 1);
		box-shadow: 0px 0px 20rpx rgba(32, 37, 64, 0.06);
		margin-top: 32rpx;
		padding: 0 32rpx 0 32rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;

		.box-left {
			display: flex;
			align-items: center;

			.text {
				margin-left: 32rpx;
				.text-one {
					font-size: 32rpx;
					font-weight: 400;
					letter-spacing: 0px;
					line-height: 1;
					color: rgba(32, 37, 64, 1);
				}

				.text-two {
					opacity: 0.3;
					/** 文本1 */
					font-size: 24rpx;
					font-weight: 400;
					line-height: 1;
					color: rgba(32, 37, 64, 1);
					margin-top: 12rpx;
				}
			}
		}
	}
</style>